.mui-cells {
  margin-top: px2rem(24);
  overflow: hidden; //因为每个cell的border使用before元素left搞的，ie下伪元素的containing block估计跟标准不同，在cell上用oh不生效
  position: relative;
  color: $colorTextMain;
}

.mui-cell {
  display: flex;
  height: px2rem(128);
  padding: 0 px2rem(32);
  // padding: px2rem(44) px2rem(32);
  position: relative; //这个是为了兼容cells容器onepx方案被before挡住而做的
  align-items: center;
  font-size: $fontSTitle;
  // line-height: 1.2857;
  background-color: #ffffff;
}



.mui-cells .mui-cell:not(.mui-cell_small) {
  &:before {
    @include setTopLine($colorLineLight);
    left: px2rem(32);
    right: px2rem(32);
  }
}

// .mui-cell_multiline {
//   height: px2rem(148);
//   padding: 0 px2rem(32);
// }

.mui-cell_first {
  &:before {
    display: none;
  }
}

.mui-cell_auto {
  height: auto;
  padding: px2rem(20) px2rem(32);
}

.mui-cell_primary {
  align-items: flex-start;
}

.mui-cell__hd_icon {
  margin-right: px2rem(16);
  // margin: px2rem(-12) px2rem(24) px2rem(-12) 0;
  width: px2rem(64);
  height: px2rem(64);

  img {
    max-width: 100%;
  }
}



// .mui-cell__hd_icon_big {
//   margin-right: px2rem(24);
//   width: px2rem(84);
//   height: px2rem(84);
// }

.mui-cell__bd {
  flex: 1;
  // font-size: $fontSTitle;
  // color: $colorTextMain;
  white-space: nowrap;
  overflow: hidden;
}

.mui-cell__bd_title_bold {
  font-weight: 600;
}

.mui-cell__bd_title_mini {
  font-size: $fontBody;
}


.mui-cell__bd_subtitle,
.mui-cell__ft_subvalue {
  margin-top: px2rem(2);
}

.mui-cell__bd_subtitle,
.mui-cell__ft_subvalue {
  color: $colorTextAssistant;
  font-size: $fontSBody;
}

.mui-cell__ft {
  text-align: right;
  white-space: nowrap;
  // overflow: hidden;
}

.mui-cell__ft_value {
  // font-size: $fontSTitle;
}



.mui-cell__ft_placeholder {
  color: $colorPlaceholder;
}

// 当list下mui-cell__bd   mui-cell__ft文本溢出时
.mui-cell_textoverflow {

  .mui-cell__bd,
  .mui-cell__ft {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }

  .mui-cell__ft {
    max-width: px2rem(180);
  }
}

.mui-cell_autoheight {
  &.mui-cell {
    height: auto;
    padding: px2rem(32);
  }

  .mui-cell__bd,
  .mui-cell__ft {
    white-space: normal;
  }

}

// size
.mui-cell_small {
  height: px2rem(72);
  font-size: $fontBody;
}

.mui-cell_middle {
  height: px2rem(96);

  .mui-cell__hd_icon {
    width: px2rem(44);
    height: px2rem(44);
  }


}

.mui-cell_large {
  height: px2rem(128);

}

.mui-cell_xlarge {
  height: px2rem(152);

  .mui-cell__hd_icon {
    width: px2rem(80);
    height: px2rem(80);
  }

  .mui-cell__bd_subtitle,
  .mui-cell__ft_subvalue {
    margin-top: px2rem(4);
  }

}

.mui-cell_access {
  @include setTapColor();
  color: inherit;

  &:active:not(.mui-cell_disabled) {
    background-color: #ECECEC;
  }
  
  .mui-cell__ft {
    padding-right: px2rem(50);

    position: relative;

    &:after {
      content: " ";
      @include setArrow(right, px2rem(14), px2rem(24));
      position: absolute;
      top: 50%;
      margin-top: px2rem(-12);
    }
  }
}
.mui-cell_disabled {
  .mui-cell__ft {
    color: $colorTextAssistant;
  }
}
